<template>
	<!-- 20230414 -->
	<view class="text-label-cn">
		<!-- 组件内容 -->
		<view class="cn-content">
			<view class="text-20" :style="{'height': height + 'rpx',
				'line-height': height + 'rpx',
				'padding-left': padding + 'rpx' ,
				'padding-right': padding + 'rpx',
				'border-radius': radius + 'rpx',
				'background': finalBgColor,
				'color':color}">
				{{text}}
			</view>
		</view>
		
		<!-- 组件浮层 -->
		<view class="cn-layer">
			
		</view>
	</view>
</template>

<script>
	import common from '@/components/hzjc/utils/common.js'
	export default {
		props: {
			// 标签文字
			text: {
				type: String,
				default: ''
			},
			// 背景色 默认主色
			bgColor: {
				type: String,
				default: ''
			},
			// 字体颜色
			color: {
				type: String,
				default: '#fff'
			},
			// 高度
			height: {
				type: Number,
				default: 30
			},
			// 边距
			padding: {
				type: Number,
				default: 10
			},
			// 弧度
			radius: {
				type: Number,
				default: 4
			}
		},
		computed: {
			/**
			 * 最终背景色
			 */
			finalBgColor() {
				return this.bgColor ? this.bgColor : common.mainColor()
			},
		}
	}
</script>

<style scoped>

</style>